@extends('admin.common.layouts')

@section('style')
    <style>
        .abtn a{
            color:#fff;
            line-height:20px;
        }
        .abtn a:hover{
            color:#fff;
            text-decoration:none;
        }
    </style>
@show

@section('content')
  <div class="col-md-12">
    <div class="box">
      <!-- 栏目信息 -->
      <div class="box-header with-border">
        <h3 class="box-title">录入成绩</h3>
      </div>

      <!-- 内容 -->
      <div class="box-body">
        <div class="x_content">
          <form method="post" action="{{url('admin/sport/meeting/addGrade')}}" class="form-horizontal form-label-left" novalidate>
            <div class="item form-group">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">运动会名 <span class="required">*</span>
              </label>
              <div class="col-md-6 col-sm-6 col-xs-12">
                <select class="form-control" name="grade[sportsmeeting_id]" id="sportsmeeting">
                        @foreach($sportsmeetings as $vo)
                        <option value="{{$vo->id}}">{{$vo->name}}</option>
                        @endforeach
                </select>
              </div>
            </div>


            <div class="item form-group">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">比赛项目 <span class="required">*</span>
              </label>
              <div class="col-md-6 col-sm-6 col-xs-12">
                <select class="form-control" name="grade[tournament_id]" id="tournament">
                        
                </select>
              </div>
            </div>

            <div class="item form-group">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">运动员 <span class="required">*</span>
              </label>
              <div class="col-md-6 col-sm-6 col-xs-12">
                <select class="form-control" name="grade[athlete_id]" id="athlete">
                        
                </select>
              </div>
            </div>

            <div class="item form-group">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">第几回合 <span class="required">*</span>
              </label>
              <div class="col-md-6 col-sm-6 col-xs-12">
                <select class="form-control" name="grade[round]" id="round">
                        
                </select>
              </div>
            </div>

            <div class="item form-group">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">成绩<div id="category"></div> <span class="required"></span>
              </label>
              <div class="col-md-6 col-sm-6 col-xs-12">
                <input id="name" name="grade[grade]"  value="" class="form-control col-md-7 col-xs-12" data-validate-length-range="6" data-validate-words="2"  placeholder="请输入成绩" required="required" type="number">
                
              </div>
            </div>
            
            <div class="ln_solid"></div>
            <div class="form-group">
              <div class="col-md-6 col-md-offset-3">
                <button type="button" class="btn btn-primary abtn"><a href="\admin\sport\meeting">返回</a></button>
                <button id="send" type="submit" class="btn btn-success">提交</button>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
@endsection

@section('javascript')
<script>
    //预处理 
    window.onload=function(){
        $(document).ready(function(){  
            $('#sportsmeeting').change(function(){  
                //选中的运动会
                var sportsmeeting_id=$(this).children('option:selected').val();
                // 根据选中值重置比赛项目选项
                selectTournament(sportsmeeting_id);
                
            })
            $('#tournament').change(function(){
                //选中的运动会
                var sportsmeeting_id = $('#sportsmeeting option:selected').val(); // 选中值  
                //选中的比赛项目
                var tournament_id=$(this).children('option:selected').val();
                // 根据选中值重置运动员选项
                selectAthlete(sportsmeeting_id,tournament_id);
                // 根据选中的项目设置可选的回合数
                selectRound(tournament_id);
            })  
            var sportsmeetingId = $('#sportsmeeting option:selected').val(); // 选中值
            selectTournament(sportsmeetingId);
            
        })
    }


    // 设置比赛项目
    function selectTournament(sportsmeetingId){
        $.ajax({  
            url : "/admin/sport/meeting/selectTournament/"+sportsmeetingId,   //请求url  
            type : "get",  //请求类型  post|get  
            // data : sportsmeetingId, //后台用 request.getParameter("key");  
            dataType : "json",  //返回数据的 类型 text|json|html--  
            success : function(result){  //回调函数 和 后台返回的 数据  
            //  var users = JSON.parse(data);
                //获取比赛项目select
                var tournamentsSelect = document.getElementById("tournament");
                // 清空上一次的选项
                tournamentsSelect.options.length = 0;
                if(result.length>0){
                    var t_id = "";
                    // 将获取到的值循环赋值给比赛项目选项
                    for(var i=0; i<result.length; i++){  //通过遍历，创建行数据 
                        //添加选项"文本","值"  
                        tournamentsSelect.add(new Option(result[i].name,result[i].tournament_id));
                        var t_id = result[i].tournament_id;   
                    }
                    //第一个比赛项目
                    var tournamentId= t_id; // 第一个值
                    selectAthlete(sportsmeetingId,tournamentId);
                    // 根据选中的项目设置可选的回合数
                    selectRound(tournamentId);
                }else{
                    selectAthlete(sportsmeetingId,tournamentId);
                    // 根据选中的项目设置可选的回合数
                    selectRound(tournamentId);
                }
                
                return result.length;
            }  
        });  
    }
    // 设置运动员
    function selectAthlete(sportsmeetingId,tournamentId){
        $.ajax({  
            url : "/admin/sport/meeting/selectAthlete/"+sportsmeetingId+'&'+tournamentId,   //请求url  
            type : "get",  //请求类型  post|get  
            // data : sportsmeetingId, //后台用 request.getParameter("key");  
            dataType : "json",  //返回数据的 类型 text|json|html--  
            success : function(result){  //回调函数 和 后台返回的 数据  
            //  var users = JSON.parse(data);
                //获取运动员select
                var athletesSelect = document.getElementById("athlete");
                // 清空上一次的选项
                athletesSelect.options.length = 0;
                if(result.length>0){
                    // 将获取到的值循环赋值给比赛项目选项
                    for(var i=0; i<result.length; i++){  //通过遍历，创建行数据 
                        //添加选项"文本","值"  
                        athletesSelect.add(new Option(result[i].name,result[i].id));   
                    }
                    
                }
                return result.length;
            }  
        });  
    }

    // 设置回合
    function selectRound(tournamentId){
        $.ajax({  
            url : "/admin/sport/meeting/selectRound/"+tournamentId,   //请求url  
            type : "get",  //请求类型  post|get  
            // data : sportsmeetingId, //后台用 request.getParameter("key");  
            dataType : "json",  //返回数据的 类型 text|json|html--  
            success : function(result){  //回调函数 和 后台返回的 数据  
            //  var users = JSON.parse(data);
                //获取回合数select
                var select = document.getElementById("round");
                // 清空上一次的选项
                select.options.length = 0;
                var round = result[0].round;
                // 将获取到的值循环赋值给比赛项目选项
                for(var i=1; i<=round; i++){  //通过遍历，创建行数据 
                    //添加选项"文本","值"  
                    select.add(new Option(i,i));   
                }
                var category = result[0].category;
                var div_category = document.getElementById("category");
                switch(category){
                    case 1001:
                        div_category.innerHTML = "时间(s)";
                        break;
                    case 2001:
                        div_category.innerHTML = "距离(m)";
                        break;
                    case 3001:
                        div_category.innerHTML = "高度(cm)";
                        break;
                    case 4001:
                        div_category.innerHTML = "积分(分)";
                        break;
                    default:
                        div_category.innerHTML = " ";
                        break;
                }                    
                return result.length;
            }  
        });  
    }


    
</script>
@show
